<button id="btn">点击我</button>
<script>

    // 普通函数中的this: 
    // 全局调用：window 
    // 事件函数: 当前事件触发的对象
    // 对象中的方法:  当前对象
    // 面向对象： 实例化的对象
    // call  apply   bind  可以改变this指向
    // 总结： 谁调用就指向谁



    /* // 全局调用：
    console.log(this);//Window
    let  fun=()=>{
        console.log(this);//Window   并不是因为是由window调用的，而是因为 箭头函数的父级环境的this为 window （此函数处于全局中，全局就是父级环境）
    }
    fun() */



   /*  // 事件函数: 
    // console.log(this);//Window
    btn.onclick=()=>{
        console.log(this);//Window  // 因为箭头函数的父级环境的this为window   （此函数处于全局中，全局就是父级环境）
    } */


   /*  // 对象中的方法:  
    console.log(this);//window 
    let obj={
        name:"zs",
        age:12,
        // say(){
        //     console.log(`我是${this.name}`);//我是zs
        // }

        say:()=>{
            // console.log(`我是${this.name}`); //我是
            console.log(this);//Window  // 因为箭头函数的父级环境的this为window （此函数处于全局中，全局就是父级环境 : 只有全局和函数才能称为环境）
            
        }
    }
    obj.say() */




    // 函数中的箭头函数：
    // 全局调用的函数中的箭头函数
    // 构造函数中的箭头函数  面向对象：  (不存在。箭头函数不能作为构造函数)
    // 对象中的方法中的箭头函数

  /*   function Fun(){
        console.log(this);

        let f=()=>{
            console.log(this);  
        }
        f()
    }
    // Fun() //Window  普通函数中的箭头函数   父级环境是Fun   而 Fun  是一个普通函数，Fun中的this指向window  所以Fun 中的this就是箭头函数父级环境中的this,所以箭头函数中的this指向window

    new Fun() //Fun {} // 构造函数中的箭头函数    父级环境是Fun   Fun是一个构造函数，this指向实例化的对象向，所以箭头函数的this也指向实例化的对象 */




   /*  let  obj={
        name:"zs",
        say(){
            console.log(this);

            let f=()=>{
                 console.log(this); //对象中的方法中的箭头函数  此时箭头函数的父级环境为say,所以say中this就是箭头函数的this
            }
            f()


        }
    }

    obj.say() //{name: 'zs', say: ƒ} */


    // 定时器中的箭头函数

    /* let  obj={
        name:"zs",
        say(){

            // let  _this=this
            // setTimeout(function(){
            //     // console.log(this); // Window   function  是window调用的
            //     console.log( _this); // {name: 'zs', say: ƒ}
                
            // },1000)

            console.log(this);//{name: 'zs', say: ƒ}


            setTimeout(()=>{
                console.log(this);//{name: 'zs', say: ƒ}
                // 此时箭头函数的父级环境为say,所以say中this就是箭头函数的this
            },1000)

        }
    }
    obj.say() */





    // call和apply和bind不能改变箭头函数的this 指向
    let xiaoming={
        name:"小明"
    }
    let  fun=function(){
        console.log(this);
    }
    fun()//Window
    fun.apply(xiaoming)//{name: '小明'}


    let f=()=>{
        console.log(this);
    }
    f() //Window
    f.apply(xiaoming) //Window
    // 因为 此时箭头函数的父级环境是全局，全局this指向window  所以箭头函数的this也指向window



    // 总结：
    // 1、箭头函数没有自己的this
    // 2、箭头函数在声明的时候就已经确定了（箭头函数放在哪个环境中），不会随着调用对象的改变而改变
    // 3、箭头函数的this 由父级环境中的this决定
    // 4、call和apply和bind等方法不能改变this指向


    // 环境：只有全局和函数才能作为环境















    // call  apply   bind  






</script>